@page "{param?}"
@using FytSoa.Application.Exam
@using FytSoa.Application.Exam.Param
@using FytSoa.Application.Sys
@using FytSoa.Application.Sys.Param
@using FytSoa.Common.Utils
@inject ExamCourseService _courseService
@inject SysCodeService _codeService
@{
    ViewData["Nav"] = 2;
    ViewData["Title"] = "直播";
    var page = Request.Query["page"];
    page = string.IsNullOrEmpty(page) ? "1" : page.ToString();
    var grade = await _codeService.GetListAsync(new CodePageParam() { TypeCode = "grand", Limit = 100 });
    var subject = await _codeService.GetListAsync(new CodePageParam() { TypeCode = "subject", Limit = 100 });

    var param = RouteData.Values["param"]?.ToString();
    var paramStr = "0-0";
    long grageId = 0, subjectId = 0;
    if (!string.IsNullOrEmpty(param))
    {
        var str = param.StrToListString('-');
        grageId = long.Parse(str[0]);
        subjectId = long.Parse(str[1]);
    }


    var list = await _courseService.GetPagesAsync(new ExamCourseSearchParam()
    {
        Page = int.Parse(page),
        GradeId = grageId,
        SubjectId = subjectId,
        Type = 2,
        Limit = 12
    });
}
<div class="main_content_inner">
    <div class="section-header border-0 uk-flex-middle">
        <div class="section-header-left">
            <h3 class="uk-heading-line text-left">
                <span> 直播 - Live </span>
            </h3>
        </div>
        <div class="section-header-right">
            <a href="#"
               uk-tooltip="title: Veiw as list; pos: top-right">
                <i class="icon-feather-list"></i>
            </a>
            <div class="display-as">
                <a href="javascript:void(0)" class="active" uk-tooltip="title: Veiw as Grid; pos: top-right">
                    <i class="icon-feather-grid"></i>
                </a>
            </div>
        </div>
    </div>
    <div class="uk-grid-small uk-grid-divider uk-child-width-auto" uk-grid>
        <div>
            <ul class="uk-subnav uk-subnav-pill" uk-margin>
                <li uk-filter-control class="@(grageId == 0 ? "uk-active" : "")">
                    <a href="/live/0-@(subjectId)">年级</a>
                </li>
            </ul>
        </div>
        <div>
            <ul class="uk-subnav uk-subnav-pill" uk-margin>
                @{
                    foreach (var item in grade)
                    {
                        <li class="@(grageId == item.Id ? "uk-active" : "")">
                            <a href="/live/@(item.Id)-@(subjectId)">@Html.Raw(item.Name)</a>
                        </li>
                    }
                }
            </ul>
        </div>
    </div>
    <div class="uk-grid-small uk-grid-divider uk-child-width-auto" uk-grid>
        <div>
            <ul class="uk-subnav uk-subnav-pill" uk-margin>
                <li uk-filter-control class="@(subjectId == 0 ? "uk-active" : "")">
                    <a href="/live/@(grageId)-0">学科</a>
                </li>
            </ul>
        </div>
        <div>
            <ul class="uk-subnav uk-subnav-pill" uk-margin>
                @{
                    foreach (var item in subject)
                    {
                        <li class="@(subjectId == item.Id ? "uk-active" : "")">
                            <a href="/live/@(grageId)-@(item.Id)">@Html.Raw(item.Name)</a>
                        </li>
                    }
                }
            </ul>
        </div>
    </div>
    <div style="padding-top:20px;">
        @{
            if (list.Items.Count == 0)
            {
                <div class="empty">
                    <img src="/assets/images/empty.png" alt=""/>
                    <p>暂无数据</p>
                </div>
            }
        }
        <div class="uk-child-width-1-4@m uk-child-width-1-3@s" uk-grid
             uk-scrollspy="target: > div; cls: uk-animation-slide-bottom-small; delay: 100">
            @{
                foreach (var item in list.Items)
                {
                    <div>
                        <a href="/live/single/@item.Id" class="video-post">
                            <!-- Blog Post Thumbnail -->
                            <div class="video-post-thumbnail">
                                <span class="video-post-count">@item.Hits</span>
                                <span class="video-post-time"></span>
                                <span class="play-btn-trigger"></span>
                                <!-- option menu -->
                                <span class="btn-option">
                                    <i class="icon-feather-more-vertical"></i>
                                </span>
                                <div class="dropdown-option-nav"
                                     uk-dropdown="pos: bottom-right ;mode : hover ;animation: uk-animation-slide-bottom-small">
                                    <ul>
                                        <li>
                                            <span> <i class="uil-history"></i> 立即观看</span>
                                        </li>
                                        <li>
                                            <span> <i class="uil-bookmark"></i> 加入书签</span>
                                        </li>
                                        <li>
                                            <span> <i class="uil-share-alt"></i> 分享</span>
                                        </li>
                                    </ul>
                                </div>

                                <img src="@item.Cover.UrlReplace()" alt="@Html.Raw(item.Title)">

                            </div>

                            <!-- Blog Post Content -->
                            <div class="video-post-content">
                                <h3> @Html.Raw(item.Title) </h3>
                                <img src="@item.Teacher.Avatar.UrlReplace()" alt="@Html.Raw(item.Teacher.Name)">
                                <span class="video-post-user">@Html.Raw(item.Teacher.Name)</span>
                                <span class="video-post-views">@Html.Raw(item.Teacher.PostName)</span>
                                <span class="video-post-date"> @item.Teacher.Age </span>
                            </div>
                        </a>
                    </div>
                }
            }
        </div>
        <ul class="uk-pagination my-5 uk-flex-center" uk-margin style="width:100%;">
            @Html.Raw(PageUtils.Htmls(int.Parse(page), 8, Convert.ToInt32(list.TotalPages), "/live/" + grageId + "-" + subjectId))
        </ul>
    </div>
</div>